.root {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    .topbar {
        position: relative;
        padding-top: 8.93vw;
        padding-bottom: 3.47vw;
        width: 100%;
        text-align: center;
        font-size: 4.8vw;
        font-weight: 100;
        color: #333333;
        background-color: #fbfbfb;

        img {
            position: absolute;
            bottom: 3.6vw;
            left: 2.8vw;
            width: 3.67vw;
        }
    }

    .search {
        display: flex;
        justify-content: space-between;

        .input {
            display: inline-block;
            width: 80.8vw;
            height: 8.93vw;
            border-radius: 2vw;
            background-color: #f4f8f7;
            border: 0;
            padding-left: 3.33vw;
        }

        .button {
            display: inline-block;
            margin-left: 3.33vw;
            width: 10.4vw;
            height: 8.93vw;
            background-color: #c55a5c;
            border-radius: 1vw;
            text-align: center;
            padding-top: 2.4vw;

            img {
                width: 5.13vw;
            }
        }
    }

    .tabbar {
        margin-top: 5.47vw;
        width: 100%;
        border-bottom: .13vw solid #eeeeee;
        padding: 0 7.87vw;
        padding-bottom: 2.93vw;

        ul {
            display: flex;
            justify-content: space-between;

            li {
                position: relative;
                font-size: 3.47vw;

                .active {
                    color: #c55a5c;
                }

                .sort {
                    position: absolute;
                    top: -0.57vw;
                    right: -2.33vw;
                    display: inline-block;

                    .fa-caret-up,
                    .fa-caret-down {
                        display: block;
                        width: 1.87vw;
                        height: 1.47vw;
                        margin: .37vw 0;
                    }
                }

            }
        }
    }

    .content {
        padding: 4.8vw 4.27vw 0 3.47vw;

        li {
            display: flex;
            margin-bottom: 4.8vw;
            height: 24.00vw;

            img {
                margin-right: 3.47vw;
            }

            .content_right {
                width: 63.00vw;

                .title {
                    display: -webkit-box; //需要显示时文本行数
                    -webkit-box-orient: vertical; //需要显示时文本行数
                    -webkit-line-clamp: 2; //需要显示时文本行数
                    overflow: hidden;
                    text-overflow: ellipsis;
                    font-size: 3.47vw;
                    color: #555555;
                }

                .text {
                    overflow: hidden;
                    white-space: nowrap; //单行文本显示
                    text-overflow: ellipsis;
                    margin: 2.87vw 0 3.30vw 0;
                    font-size: 2.67vw;
                    color: #999999;
                }

                .money {
                    margin-bottom: 1.27vw;
                    font-size: 2.4vw;
                    color: #c55a5c;
                }

                .border {
                    width: 100%;
                    height: .13vw;
                    background-color: #6e6e6e;
                    opacity: .2;
                }
            }
        }
    }

    .goup {
        position: fixed;
        bottom: 11.2vw;
        right: 4.27vw;

        img {
            width: 7.2vw;
        }
    }
}